import 'package:erp_widget/erp_widget.dart';
import 'package:flutter/material.dart';

/// 边框
enum DxCellBorderPosition { none, top, bottom, topAndBottom }

/// 箭头方向
enum DxCellArrowDirection { up, down, left, right }

/// Cell 单元格,最好使用在DxCellGroup中（可以从父级中统一设置字体样式）
/// 与DxListTile差不多，这里理解为简化版的DxListTile
/// 使用场景：单元格用于非循环列表
class DxCell extends StatelessWidget {
  /// 外边距
  final EdgeInsets margin;

  /// 内边距
  final EdgeInsets padding;

  /// 装饰
  final Decoration? decoration;

  /// 高度
  final double height;

  /// 权限，是否禁用
  final bool disabled;

  /// 是否只读
  final bool readOnly;

  /// 只读提示文本
  final String readOnlyText;

  /// 边框位置
  final DxCellBorderPosition borderPosition;

  final double borderRadius;

  /// 背景颜色
  final Color color;

  /// 左侧标题
  final String? title;
  final TextStyle? titleStyle;
  final Widget? titleWidget;

  /// 一级标题右侧的描述
  final String desc;
  final Widget? descWidget;
  final TextStyle? descStyle;

  /// 标题下方的描述信息
  final String? subTitle;
  final TextStyle? subTitleStyle;
  final Widget? subTitleWidget;

  /// 自定义左侧组件
  final Widget? leading;

  /// 是否展示右侧箭头并开启点击反馈
  final bool trailingLink;

  /// 箭头方向，可选值为 `left` `up` `down`
  final DxCellArrowDirection arrowDirection;

  /// 右侧文本
  final String? trailing;
  final TextStyle? trailingStyle;
  final Widget? trailingWidget;

  final double slidablePadding;

  /// 滑动长度比例，Must be between 0 (excluded) and 1.
  final double slidableExtentRatio;

  /// 滑动事件
  final List<DxSlidableAction>? slidableActionList;

  /// 点击单元格时触发
  final VoidCallback? onClick;

  final Widget _sizedBoxShrink = const SizedBox.shrink();

  final bool autoHeight;

  const DxCell({
    Key? key,
    this.margin = EdgeInsets.zero,
    this.padding = const EdgeInsets.symmetric(horizontal: 15.0),
    this.height = 54,
    this.decoration,
    this.disabled = false,
    this.readOnly = false,
    this.readOnlyText = '禁用',
    this.borderPosition = DxCellBorderPosition.bottom,
    this.borderRadius = 0,
    this.color = Colors.white,
    this.trailingLink = false,
    this.arrowDirection = DxCellArrowDirection.right,
    this.leading,
    this.title,
    this.titleStyle,
    this.titleWidget,
    this.desc = '',
    this.descStyle,
    this.descWidget,
    this.subTitle,
    this.subTitleStyle,
    this.subTitleWidget,
    this.trailing,
    this.trailingStyle,
    this.trailingWidget,
    this.slidablePadding = 0,
    this.slidableActionList,
    this.slidableExtentRatio = 0.5,
    this.onClick,
    this.autoHeight = false,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final DxCellGroup? parent = context.findAncestorWidgetOfExactType<DxCellGroup>();

    /// 改变字体样式
    TextStyle $titleStyle = titleStyle ?? parent?.cellTitleStyle ?? DxStyle.$333333$14;
    TextStyle $subTitleStyle = subTitleStyle ?? parent?.cellSubTitleStyle ?? DxStyle.$GRAY6$12;
    TextStyle $trailingStyle = trailingStyle ?? parent?.cellTrailingStyle ?? DxStyle.$404040$14;

    /// DxCellGroup的背景颜色优先
    Color? $color = parent?.color ?? color;

    bool hasSubTile = subTitleWidget != null || subTitle != null;

    Widget current = Container(
      margin: margin,
      padding: autoHeight ? const EdgeInsets.symmetric(horizontal: 15, vertical: 15) : padding,
      height: autoHeight ? null : height,
      alignment: Alignment.center,
      decoration: decoration ??
          BoxDecoration(
            color: $color,
            border: Border(
              top: (borderPosition == DxCellBorderPosition.top || borderPosition == DxCellBorderPosition.topAndBottom)
                  ? const BorderSide(color: DxStyle.$F5F5F5, width: 0.5)
                  : BorderSide.none,
              bottom:
                  (borderPosition == DxCellBorderPosition.bottom || borderPosition == DxCellBorderPosition.topAndBottom)
                      ? const BorderSide(color: DxStyle.$F5F5F5, width: 0.5)
                      : BorderSide.none,
            ),
          ),
      foregroundDecoration: disabled || readOnly
          ? const BoxDecoration(color: DxStyle.$D8D8D8, backgroundBlendMode: BlendMode.lighten)
          : null,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        crossAxisAlignment: CrossAxisAlignment.center,
        children: <Widget>[
          leading != null ? Padding(padding: const EdgeInsets.only(right: 10), child: leading) : _sizedBoxShrink,
          Column(
            mainAxisSize: MainAxisSize.max,
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              _buildTitle($titleStyle),
              hasSubTile ? const SizedBox(height: 4) : _sizedBoxShrink,
              subTitleWidget ?? (subTitle != null ? Text(subTitle!, style: $subTitleStyle) : _sizedBoxShrink),
            ],
          ),
          if (trailing != null) const SizedBox(width: 10) else const Spacer(),
          trailingWidget ??
              Expanded(
                  child: (trailing != null
                      ? Text(
                          trailing!,
                          style: $trailingStyle,
                          textAlign: TextAlign.right,
                        )
                      : _sizedBoxShrink)),
          trailingLink ? Icon(_arrowIcon, size: 20, color: DxStyle.gray6) : _sizedBoxShrink,
        ],
      ),
    );
    if (borderRadius != 0) {
      current = ClipRRect(borderRadius: BorderRadius.circular(borderRadius), child: current);
    }

    if (slidableActionList != null) {
      current = DxSlidable(
        groupTag: '0',
        padding: slidablePadding,
        endActionPane: DxActionPane(
          extentRatio: slidableExtentRatio,
          motion: const DxScrollMotion(),
          children: slidableActionList!,
        ),
        child: current,
      );
    }

    return GestureDetector(
        onTap: () {
          if (disabled) return DxTools.noVip(context);
          if (readOnly) {
            DxToast.info(readOnlyText);
            return;
          }
          onClick?.call();
        },
        child: current);
  }

  Widget _buildTitle(TextStyle titleStyle) {
    if (desc == '' && descWidget == null) {
      return titleWidget ?? (title != '' ? Text(title!, style: titleStyle) : _sizedBoxShrink);
    }
    return Row(
      crossAxisAlignment: CrossAxisAlignment.center,
      children: [
        titleWidget ?? (title != '' ? Text(title!, style: titleStyle) : _sizedBoxShrink),
        const SizedBox(width: 8),
        descWidget ?? (desc != '' ? Text(desc, style: descStyle ?? DxStyle.$999999$12) : _sizedBoxShrink),
      ],
    );
  }

  /// 箭头icon
  IconData get _arrowIcon {
    switch (arrowDirection) {
      case DxCellArrowDirection.up:
        return Icons.keyboard_arrow_up;
      case DxCellArrowDirection.down:
        return Icons.keyboard_arrow_down;
      case DxCellArrowDirection.left:
        return Icons.keyboard_arrow_left;
      case DxCellArrowDirection.right:
        return Icons.keyboard_arrow_right;
    }
  }
}
